<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
</head>
<body>
<!--DOM (Document Object Model) 译为文档对象模型，是 HTML 和 XML 文档的编程接口。

HTML DOM 定义了访问和操作 HTML 文档的标准方法。

DOM 以树结构表达 HTML 文档。


getElementById()	返回带有指定 ID 的元素。
getElementsByTagName()	返回包含带有指定标签名称的所有元素的节点列表（集合/节点数组）。
getElementsByClassName()	返回包含带有指定类名的所有元素的节点列表。
appendChild()	把新的子节点添加到指定节点。
removeChild()	删除子节点。
replaceChild()	替换子节点。
insertBefore()	在指定的子节点前面插入新的子节点。
createAttribute()	创建属性节点。
createElement()	创建元素节点。
createTextNode()	创建文本节点。
getAttribute()	返回指定的属性值。
setAttribute()	把指定属性设置或修改为指定的值。

-->


<p id="intro"  onclick="aa()">Hello World!</p>

<script>
    var txt=document.getElementById("intro").innerHTML;
    document.write(txt);

    /*换行 \n 不行要浏览器认识解析*/
    document.write('</br>');

    var txt2=document.getElementById("intro").innerText;
    document.write(txt2);

</script>




<script>


    function aa(){
        document.write("页面加载完成后 document.write 会覆盖其他内容!!");
    }

    alert(  document.getElementById('intro').getAttribute('onclick'))
    document.getElementById('intro').setAttribute('onclick','bb()')


    function bb(){
        document.write("动态改变点击事件方法")
    }
</script>

</body>
</html>